<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@include file="common/header.jsp"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<div class="page-content">
    <table class="data-table" id="contentItems">
        <tr>
            <th width="8%">顺序</th>
            <th width="10%">广告类型</th>
            <th width="15%">软件名称</th>
            <th width="20%">URL</th>
            <th width="8%">状态</th>
            <th width="20%">图片地址</th>
            <th width="14%">操作</th>
        </tr>
        <div id=""></div>
    </table>

</div>
<%@include file="common/footer.jsp"%>

<script>
    <%--数据初始化--%>
    $(getAll())

    function getAll() {
        $.post("/content1/getContentAll",null,function (response) {
            //有数据
            for (var i = 0 ;i<response.length;i++){
                var items = "<tr><td>"+response[i].sortOrder+"</td><td>"+response[i].categoryId+"</td><td>"+response[i].title+"</td><td><a target=\'_blank\' href= \'"+response[i].url+"\'>"+response[i].url+"</a></td><td>"+(response[i].status == 0 ? '不可见' :'可见')+"</td><td><a target=\'_blank\' href= \'"+response[i].pic+"\'>查看图片</a></td><td><button class=\'btn-edit\' onclick=\'updateItem("+response[i].id+")\'>修改</button><button class=\'btn-delete\' onclick=\'deleteItem("+response[i].id+")\'>删除</button></td></tr>"
                $("#contentItems").append(items)
            }
        },"json")
        };

    //更改
    function updateItem(id) {
        window.location.href = "${pageContext.request.contextPath }/jsp/developer/controlPage.jsp?id="+id;
    };

    //删除
    function deleteItem(id) {
        console.log("正在发送请求")
        $.post("/content1/deleteContent",{id:id},function () {
            //刷新页面
            location.reload();
        },"json")

        }
</script>

<style>
    .page-content {
        padding: 20px;
        background: #fff;
        box-shadow: 0 1px 4px rgba(0,0,0,.1);
        padding-bottom: 100px;
    }
    .data-table {
        width: 100%;
        border-collapse: collapse;
        margin-top: 15px;
    }
    .data-table th, .data-table td {
        border: 1px solid #ddd;
        padding: 8px 12px;
        text-align: center;
    }
    .data-table th {
        background: #f5f5f5;
    }
    .btn-edit, .btn-delete{
        padding: 4px 8px;
        margin: 0 3px;
        cursor: pointer;
    }
    .btn-edit {
        background: #555;
        color: white;
    }
    .btn-delete {
        background: #555;
        color: white;
    }
</style>


